<template>
  <div class="manage">
    <div class="middle-tab">
      <div class="order-icon">
        <i class="wodetuandui order-icon-i"></i>
        <div class="wenzi_color">我的团队</div>
      </div>
      <router-link to="/user-cumulation">
        <div class="order-icon">
          <i class="leijishouyi order-icon-i"></i>
          <div class="wenzi_color">我的收益</div>
        </div>
      </router-link>
      <div class="order-icon">
        <i class="shouhuodizhi order-icon-i"></i>
        <div class="wenzi_color">收货地址</div>
      </div>
      <div class="order-icon">
        <i class="wodedianpu order-icon-i"></i>
        <div class="wenzi_color">我的店铺</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'UserManage'
}
</script>

<style lang="stylus" scoped>
@import '~styles/mixins.styl'
.manage
  background-color: white
  border-top: 1px solid #eee
  border-bottom: 1px solid #eee
  margin-top: 10px
  .middle-tab
    background-color: white
    padding: 5px
    .order-icon
      width: 23%
      text-align: center
      display: inline-block
      vertical-align: middle
      padding-bottom: 5px
      padding-top: 7px
      border-bottom: 5px solid #fff
      .order-icon-i
        display: block
        width: 50px
        height: 50px
        margin: 0 auto
        background-image: url('https://evenyou.meimai94buy.com/weixinpl/mshop/images/info_image/wode_sprite.png')
        background-size: cover
      .wodetuandui
        background-position: 0 -8rem
      .leijishouyi
        background-position: 0 -7rem
      .shouhuodizhi
        background-position: 0 0
      .wodedianpu
        background-position: 0 -1rem
</style>
